<template>
  <ul class="nav-box">
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
    <li>
      <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png" >
      <span>嗨购超市</span>
    </li>
  </ul>
</template>

<script>

export default {
    name:"NavBar",
    data(){
      return {
      }
    }
}
</script>

<style scoped>
  .nav-box{
    width: 100%;
    height: 10rem;
    /* background-color: gray; */
    display: flex;
    flex-wrap: wrap;    
  }

  .nav-box li{
    width: 20%;
    height: 5rem;
    /* border:1px solid black; */
    box-sizing: border-box;
    font-size:12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
  }


  .nav-box li img{
    width: 2.5rem;
    height: 2.5rem;
  }




</style>